<template>
    <div id="footer">
        <el-checkbox v-model="checkedAll" size="small" />
        <span>{{ checkedSelect }}</span>
        <!-- <span>{{ datas.length }}</span> -->
        <el-button @click="delSelect">清除已完成任务</el-button>
    </div>
</template>

<script setup>
import useTodoListStore from '../store/module/TodoList';
import { ElMessage, ElMessageBox } from 'element-plus'
import { storeToRefs } from 'pinia'
import { ref, computed } from 'vue'
const todoListStore = useTodoListStore()
const { datas, checkedAll, checkedSelect } = storeToRefs(todoListStore)
const { delSelect } = todoListStore

</script>

<style scoped>
#footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
</style>
